
<template>
    <vo-table ref="yuTable" :data="data.tableData.data" :cols="data.tableData.cols" :config="data.tableData.config" @fetch-data="query" @vue:mounted="query"  >
      <template #leftBar>
        <tiny-input v-model="data.searchData.appId" placeholder="ID"></tiny-input>
        <tiny-input v-model="data.searchData.appNameLike" placeholder="昵称"></tiny-input>
        <tiny-input v-model="data.searchData.tagLike" placeholder="手机"></tiny-input>
        <tiny-button  size="small" ghost type="info" @click="query"  ><vo-icon iconName="sousuo"  ></vo-icon>查询</tiny-button>
        </template>
        <template #rightBar>

        </template>
          <tiny-button-group class="ml-4">
            <tiny-button ghost type="success" size="small"  @click="addDict"><vo-icon iconName="add" ></vo-icon>新增</tiny-button>
        </tiny-button-group>

        <template v-slot:statusSolt="{row}">
            <tiny-switch v-model="row.enable"></tiny-switch>
      </template>
           
    </vo-table>
</template>
<script setup>
  import {reactive, ref, getCurrentInstance,onMounted} from 'vue';  
  import { TinyCollapse, TinyCollapseItem ,TinySwitch ,Modal} from '@opentiny/vue'
  const {proxy} = getCurrentInstance();
  const data = reactive({
    tableData: {  data: {}, cols: [],  config: {} },
    searchData: {  appId: '',  appNameLike: '',  tagLike: '',namespaceId: '',index: 0,pageSize: 10},
  })
  data.tableData.data = []
  data.tableData.cols = [
    {type: 'index',title: '序号'},
    {title: '账户类型', key: 'accountType', align: 'left'},
    {title: '用户', key: 'username', align: 'left'},
    {title: '昵称', key: 'nick', align: 'left'},
    {title: '手机', key: 'phone', align: 'left'},
    {title: '邮箱', key: 'email', align: 'left'},
    {title: '状态', key: 'enable', align: 'left',slot: 'statusSolt', },
    {title: '管理员', key: 'modifierShowName', align: 'left'},

]
const query = ()=>{
  proxy.$api.taskJob.userQueryList(data.searchData).then(res=>{
     console.log(res)
     data.tableData.data = res

  })
}
</script>

<style lang="scss" scoped>



</style>